import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'

// rem基准值计算
import 'lib-flexible'

import './style/reset.css'
import './style/main.scss'

// antd-mobile 样式完整引入
// 里面组件有很多，但是在当前应用中可能用不到所有的，所以没有用到的样式引入进入来后对于打包入口文件就会变大不友好
// 1.cdn引入样式
// 2.按需引入
//   npm i -D babel-plugin-import
//   在当前项目根目录下面创建一个 craco.config.js 文件
// import 'antd-mobile/dist/antd-mobile.css'

// 扩展应用方法
import './utils/extendApp'

// react-redux 此库便于我们在react组件中操作redux
import { Provider } from 'react-redux'
import store from './store'
import storage from './utils/storage'

// 定义当前应用它的路由模式 BrowserRouter, HashRouter
import { BrowserRouter as Router } from 'react-router-dom'

// 第3方插件也可以实现redux数据持久化
// https://blog.csdn.net/hbmern/article/details/124184309
// let sessionStoreHotCateData = window.sessionStorage.getItem('hotcatedata')
let sessionStoreHotCateData = storage().get('hotcatedata')
if (sessionStoreHotCateData) {
  // 更新到redux中的状态里面
  store.dispatch({
    type: 'cate/hotCateData',
    payload: sessionStoreHotCateData
  })
}

const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(
  <Provider store={store}>
    <Router>
      <App />
    </Router>
  </Provider>
)
